.border-corners-w-2 {
    --ss-corner-w: 2px;
}
.border-corners-len-25 {
    --ss-corner-len: 25px;
}
.border-corners-shadow-5{
    --ss-corner-s:5px;
}

.border-corners {
    position: relative;
    width: 100%;
    height: 100%;
}
.border-corners:before,
.border-corners:after,
.border-corners>:first-child:before,
.border-corners>:first-child:after {
    position: absolute;
    width: var(--ss-corner-len);
    height: var(--ss-corner-len);
    border-color: red;
    /* box-shadow: 0px 0px 0px 2px red; */
    /* or whatever colour */
    border-style: solid;
    /* or whatever style */
    content: ' ';
}
.border-corners:before {
    top: 0;
    left: 0;
    border-width: var(--ss-corner-w) 0 0 var(--ss-corner-w);
    box-shadow: -1px -1px 0 1px blue;
}
.border-corners:after {
    top: 0;
    right: 0;
    border-width: var(--ss-corner-w) var(--ss-corner-w) 0 0;
    box-shadow: 1px -1px 0 1px blue;
}
.border-corners>:first-child:before {
    bottom: 0;
    right: 0;
    border-width: 0 var(--ss-corner-w) var(--ss-corner-w) 0;
    box-shadow: 1px 1px 0 1px blue;
}
.border-corners>:first-child:after {
    bottom: 0;
    left: 0;
    border-width: 0 0 var(--ss-corner-w) var(--ss-corner-w);
    box-shadow: -1px 1px 0 1px blue;
}